---
title: Complete list of SVG Logos
h1: Logos
layout: default
---
{%- assign sorted_pages = site.pages | sort:'sort' -%}
{%- capture checkon %}<i class="fa fa-check"></i>{% endcapture -%}
{%-capture checkoff %}<i class="fa fa-fw"></i>{% endcapture -%}

{%- assign letters = "abc def ghi jkl mno pqrs tuv wxyz 0123456789" | split: ' ' -%}

<ul class="nav nav-tabs" id="vlz-tabs" role="tablist">
{%- for letter in letters %}
	<li role="presentation"  class="nav-item" id="tab-{{letter}}"><a aria-controls="tab-data-{{ letter }}" class="nav-link{% if forloop.first %} active{% endif %}" href="#{{ letter }}" id="tab-link-{{ letter }}" role="tab">{% if letter == "0123456789" %}0-9{% else %}{{ letter | upcase }}{% endif %}</a></li>
{% endfor -%}
</ul>
<p id="focustarget"></p>

<div class="tab-content">
{%- for letter in letters -%}
	{%- assign logocount = 0 %}
	<div role="tabpanel" class="tab-pane vlz-tab-data" id="tab-data-{{ letter }}" {% if forloop.first %}{% else %}style="display:hidden;"{% endif %} >
		<p></p>
		<div class="logo-container" id="vector{{ letter }}">
		{%- for logopage in sorted_pages -%}
			{%- if logopage.noindex %}{% else %}
				{%- if logopage.logohandle -%}
					{%- capture logofile %}{{ logopage.logohandle }}-ar21.svg{% endcapture -%}
					{%- if logopage.images contains logofile -%}
						{%- assign startsWith = logopage.sort | slice: 0,1 -%}
						{%- if letter contains startsWith %}
            <a href="{{ logopage.url }}{{site.indexpage}}"><img alt="{{logopage.title}} logo" src="{{ logopage.logohandle }}/{{ logofile }}" title="{{logopage.title}}"/></a>
							{%- assign logocount = logocount | plus:1 %}
						{%- endif -%}
					{%- endif -%}
				{%- endif %}
			{%- endif -%}
		{%- endfor %}
		<p>Count: {{ logocount }}</p>
		</div>
	</div>
{%- endfor %}
</div>
<script>

	function switchTabs()
	{
		$("#vlz-tabs > li").removeClass("active");
		var hash = window.location.hash;
		console.log("hash=" + hash);
		if (!hash || hash == '#')
		{
			$("#tab-link-{{ letters[0] }}").addClass("active");
			$("#tab-data-{{ letters[0] }}").show();
		}
		else
		{
			$(".vlz-tab-data").hide();
			$("#vlz-tabs > li > .nav-link").removeClass("active");
			$("#tab-data-" + hash.substring(1)).show();
			$("#tab-link-" + hash.substring(1)).addClass("active");
			$("#focustarget").focus();
		}
	}

	$(document).ready(function() {
		switchTabs();
		$(window).bind('hashchange', switchTabs);
	});

</script>


